{include file="common/header"/}

<div class="layui-fluid">
    <div class="layui-row layui-col-space15">
      <div class="layui-col-md12">
        <div class="layui-card">
          <div class="layui-card-body">
            <div class="layui-row">
              <form action="" class="layui-form layui-form-pane" lay-filter="form">
              	<input type="hidden" name="id" id="" value="" />
                <div class="layui-form-item">
                    <label class="layui-form-label">请选择公众号</label>
                    <div class="layui-input-inline">
                        <select name="wx_id" lay-verify="required" lay-filter="wechat_id" id="wechat_id">
                            {volist name="wechat" id="vo"}
                            <option value="{$vo.id}" >{$vo.name}</option>
                            {/volist}
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">父级</label>
                    <div class="layui-input-inline">
                        <select name="pid" lay-verify="required" lay-filter="pid" id="menuList">
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">菜单名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="title" lay-verify="required" placeholder="菜单名称" class="layui-input">
                    </div>
                    <div class="layui-form-mid layui-word-aux">
                        *
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">菜单内容</label>
                    <div class="layui-input-inline">
                        {volist name="eventType" id="vo"}
                        <input type="radio" name="menu_event" lay-filter="menu_event" {if $Think.lang.$key == 'click'} checked {/if} value="{$key}" title="{$vo}">
                        {/volist}
                    </div>
                </div>
                <div class="layui-form-item click">
                    <label class="layui-form-label">选择规则</label>
                    <div class="layui-input-inline">
                        <select name="keys_id" lay-verify="required" lay-filter="keys_id" id="keys_id">
                            
                        </select>
                    </div>
                </div>
                <div class="layui-form-item view">
                    <label class="layui-form-label">页面地址</label>
                    <div class="layui-input-inline">
                        <input type="text" name="menu_event_url" placeholder="页面地址" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item miniprogram">
                    <label class="layui-form-label">小程序ID</label>
                    <div class="layui-input-inline">
                        <input type="text" name="appid" placeholder="小程序ID" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item miniprogram">
                    <label class="layui-form-label">小程序页面路径</label>
                    <div class="layui-input-inline">
                        <input type="text" name="pagepath" placeholder="页面路径" class="layui-input">
                    </div>
                </div>
                <div class="layui-form-item miniprogram">
                    <label class="layui-form-label">页面地址</label>
                    <div class="layui-input-inline">
                        <input type="text" name="url" placeholder="页面地址" class="layui-input">
                    </div>
                </div>

                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn" lay-submit="" lay-filter="editSubmit">立即提交</button>
                    </div>
                </div>
              </form>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

{include file="common/footer"/}
<script>
var layForm;
layui.extend({
  iconPickerFa: 'lib/iconPicker/iconPickerFa' // {/}的意思即代表采用自有路径，即不跟随 base 路径
}).use(['form', 'layer','iconPickerFa', 'upload'], function(){
    var layer = layui.layer,$= layui.jquery;
    var upload = layui.upload;
    layForm = layui.form;
    var iconPickerFa = layui.iconPickerFa;
    var info  = {:json_encode($info)};
    if(info){
        layForm.val('form',info);
    }

    layForm.on('submit(editSubmit)', function (data) {
        // 提交到方法 默认为本身
        var loading = layer.load(1, {shade: [0.1, '#fff']});
        $.post("{:url('edit')}", data.field, function (res) {
            layer.close(loading);
            if (res.code > 0) {
                layer.msg(res.msg, {time: 1800, icon: 1}, function () {
                    window.parent.location.href = res.url;
                });
            } else {
                layer.msg(res.msg, {time: 1800, icon: 2});
            }
        });
    });
	layForm.on('select(wechat_id)', function(data){
		get_menu(data.value,info);
        get_keys(data.value);
	});
    layForm.on('radio(menu_event)', function(data){
        if (data.value == 'click') {
            get_keys($('#wechat_id option:selected').val());
            $('.click').show();
            $('.view').hide();
            $('.miniprogram').hide();
        }
        if (data.value == 'view') {
            $('.click').hide();
            $('.view').show();
            $('.miniprogram').hide();
        }
        if (data.value == 'miniprogram') {
            $('.click').hide();
            $('.view').hide();
            $('.miniprogram').show();
        }
    }); 
    var mtype = $("input[name=menu_event]:checked").val();
    if (mtype == 'click') {
        get_keys($('#wechat_id option:selected').val());
        $('.click').show();
        $('.view').hide();
        $('.miniprogram').hide();
    }
    if (mtype == 'view') {
        $('.click').hide();
        $('.view').show();
        $('.miniprogram').hide();
    }
    if (mtype == 'miniprogram') {
        $('.click').hide();
        $('.view').hide();
        $('.miniprogram').show();
    }
    get_menu($('#wechat_id option:selected').val(),info);
});
function get_keys(wx_id){
    $.ajax({
        url:"{:url('selectKey')}",
        dataType:"json",
        data:{"wx_id":wx_id},  
        type:"post",
        success:function(req){
            var datalist = req.data;
            var html = '';
            if(datalist.length > 0){
                for (var i = 0; i < datalist.length; i++) {
                    html +="<option value='"+datalist[i]['id']+"'>"+datalist[i]['keys']+"</option>";
                }
            }
            $('#keys_id').empty().append(html);
            layForm.render();
            return false;
        },
        error:function(){
            layer.msg('请求出错');return false;
        }
    })
}
function get_menu(wx_id,info){
    $.ajax({
        url:"{:url('get_menu')}",
        dataType:"json",
        data:{"wx_id":wx_id},  
        type:"post",
        success:function(req){
        	var datalist = req.data;
        	var html = '';
        	html +="<option value='0'>默认顶级</option>";
        	if(datalist.length > 0){
        		for (var i = 0; i < datalist.length; i++) {
        			if(info.pid == datalist[i]['id']){
        				html +="<option value='"+datalist[i]['id']+"' selected>"+datalist[i]['title']+"</option>";
        			}else{
        				html +="<option value='"+datalist[i]['id']+"'>"+datalist[i]['title']+"</option>";
        			}
                    
                }
        	}
            $('#menuList').empty().append(html);
            layForm.render();
            return false;
        },
        error:function(){
            layer.msg('请求出错');return false;
        }
    })
}
</script>